<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <style type="text/css">
        .box {
            /*非IE的主流浏览器识别的垂直居中的方法*/
            display: table-cell;
            vertical-align: middle;
            /*设置水平居中*/
            text-align: center;
            /* 针对IE的Hack */
            *display: block;
            *font-size: 437px; /*这个值大概为最大高度的0.875*/
            *font-family: Arial; /*防止非utf-8引起的hack失效问题，如gbk编码*/
            width: 500px;
            height: 500px;
            border: 1px solid #eee;
        }

        .box img {
            /*设置图片垂直居中*/
            vertical-align: middle;
            /*非IE6下的等比缩放*/
            max-height: 500px;
            max-width: 500px;
            /*IE6下的等比缩放，注意expression其实是运行了一个JS程序，所以如果图片很多的话会引起CPU占用率高*/
            width: expression(this.width >500 && this.height <= this.width ? 500: true);
            height: expression(this.height > 500 && this.width <= this.height ? 500 : true);
        }
    </style>
    <title>无标题文档</title>

</head>
<body>
<div class=box>
    <img src=channelShow/images/4_channel.jpg>
</div>
</body>
</html>
